import React ,{useEffect}from 'react'
import {Dialog,Toast,Button, Field, Form } from "react-vant"
function My_dialog({visible,onCancel,fromValue,onConfirm}) {
    const [form] = Form.useForm();
    useEffect(()=>{
        form.setFieldsValue({
            ...fromValue
        })
    },[fromValue])
    const onFinish = (values) => {
        values.id = fromValue.id
        onConfirm(values)
    };
  return (
    <div>
         <Dialog
                showConfirmButton={false}
                visible={visible}
                title="标题"    
                onConfirm={() => {
                    Toast.info('点击确认按钮');
                }}
            >
                  <Form
                    form={form}
                    showValidateMessage={false}
                    onFinish={onFinish}
                    footer={
                        <div style={{ margin: '16px 16px 0' ,display:"flex"}} >
                             <Button round  type="primary" block onClick={onCancel}>
                                取消
                            </Button>
                            <Button round nativeType="submit" type="primary" block>
                                提交
                            </Button>
                        </div>
                    }
                    >
                    <Form.Item
                        tooltip={{
                        message:
                            'A prime is a natural number greater than 1 that has no positive divisors other than 1 and itself.',
                        }}
                        rules={[{ required: true, message: '请填写value' }]}
                        name="value"
                        label="value"
                    >
                        <Field placeholder="请输入value" />
                    </Form.Item>
                    <Form.Item rules={[{ required: true, message: '请填写日期' }]} name="date" label="日期">
                        <Field placeholder="请输入日期" />
                    </Form.Item>
                    </Form>
            </Dialog>
    </div>
  )
}

export default My_dialog